import { Navigate, useRoutes } from 'react-router-dom'
import NotFound from '../components/404'
import Login from '../components/Login'
import Main from '../components/Main'
import About from '../components/Main/About'
import Home from '../components/Main/Home'
import Music from '../components/Main/Home/Music'
import News from '../components/Main/Home/News'
import Game from '../components/Main/About/Game'
import Hero from '../components/Main/About/Hero'

const routes=[
    {
        path:'/login',
        element:<Login />
    },
    {
        path:'/main',
        element:<Main />,
        children:[
            {
                path:'/main/about',
                element:<About/>,
                children:[
                    {
                        path:'/main/about/hero',
                        element:<Hero />,  
                    },
                    {
                        path:'/main/about/game',
                        element:<Game />,
                    }
                ]
            },
            {
                path:'/main/home',
                element:<Home/>,
                children:[
                    {
                        path:'/main/home/music',
                        element:<Music />
                    },
                    {
                        path:'/main/home/news',
                        element:<News />
                    }
                ]
            },
        ]
    },
    {
        path:'/login',
        element:<Navigate />
    },
    {
        path:'/login',
        element:<NotFound />
    },
]

export default  routes

export const GetRoutes=()=>{
    return useRoutes(routes)
}